/********************
点击考核名称后的指标填报弹窗
** */
<template>
  <el-dialog
    width="80%"
    title="指标填报"
    :close-on-click-modal="false"
    :visible.sync="visible"
    top="8vh"
    @close="closeDialog()"
  >
    <el-form
      ref="dataForm"
      :model="dataForm"
      label-position="right"
      label-width="120px"
    >
      <el-row>
        <el-col :span="12">
          <el-form-item label="考核名称:" prop="name" style="width:60%">
            <span>{{dataForm.name}}</span>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="周期名称:" prop="date" style="width:60%">
            <span>{{dataForm.period}}</span>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="考核时间:" prop="sname" style="width:60%">
            <span>{{dataForm.assessBeginTime?dataForm.assessBeginTime.slice(0,10):""}}--{{dataForm.assessEndTime?dataForm.assessEndTime.slice(0,10):''}}</span>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item :label="dataForm.type==0?'被考核人':'被考核机构'" prop="ids" style="width:60%;">
            <span v-if="dataForm.type==0">
              <span v-for="it in dataForm.assessTarget" :key="it">{{it}},</span>
            </span>
            <span v-else>
              <span v-for="it in dataForm.assessTarget1" :key="it">{{it}},</span>
            </span>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <div style="height: 10px; border-top: 1px solid #b0bde2"></div>
    <div class="tabBox">
      <div class="btnBox">
        <div></div>
      </div>
    </div>
    <el-row>
      <el-table
        style="width: 100%;margin-top:20px"
        :data="dataList"
        border
        stripe
        header-align="center"
        @selection-change="handleSelectionChange"
      >
        <el-table-column type="selection" header-align="center" width="55"></el-table-column>
        <el-table-column prop="type" align="center" label="指标类别" width="140"></el-table-column>
        <el-table-column prop="name" align="center" label="指标名称" show-overflow-tooltip></el-table-column>
        <el-table-column prop="weight" align="center" label="权重" show-overflow-tooltip></el-table-column>
        <el-table-column prop="formula" align="center" label="计算公式" show-overflow-tooltip></el-table-column>
        <el-table-column prop="targetValue" align="center" label="目标值" show-overflow-tooltip></el-table-column>
        <el-table-column prop="finishValue" align="center" label="完成值">
          <template slot-scope="scope">
            <span>
              <el-input
                v-model="scope.row.finishValue"
                @input="getScore(scope.row, scope.$index)"
                oninput="value=value.replace(/[^\-\d.]/g, '').replace(/^\./g, '').replace(/\.{2,}/g, '.').replace(/(\.\d+)\./g, '$1').replace(/(-)\./g, '$1').replace(/\-{2,}/g, '-').replace(/(\d+|\.)-/g, '$1').replace(/-(0){2,}/g, '$1').replace(/(-)0+(\d+)/g, '$1$2').replace(/^0+(\d)/, '$1').replace(/(\d{15})\d*/, '$1').replace(/(\.\d{4})\d*/, '$1')"

              ></el-input>
            </span>
          </template>
        </el-table-column>
        <el-table-column prop="score" align="center" label="得分">
          <template slot-scope="scope">
            <span>
              <el-input v-model.number="scope.row.score"></el-input>
            </span>
          </template>
        </el-table-column>
        <el-table-column prop="unit" align="center" label="单位" show-overflow-tooltip></el-table-column>
        <el-table-column prop="completeValue" align="center" label="完成值获取方式" show-overflow-tooltip></el-table-column>
        <el-table-column prop="provideDeptName" align="center" label="数据提供部门" show-overflow-tooltip></el-table-column>
        <!--<el-table-column prop="itemIndex" align="center" label="排序号" show-overflow-tooltip></el-table-column>-->
      </el-table>
    </el-row>
    <span slot="footer" class="dialog-footer">
      <el-button type="primary" plain @click="handleConfirm">确定</el-button>
      <el-button type="primary" plain @click="closeDialog()">返回</el-button>
    </span>
    <!-- 日常考核指标库 -->
    <el-dialog title="业绩合同指标库" :visible.sync="dialogVisible" width="80%" append-to-body>
      <zhibiaoTable ref="zhibiaoRef" @func="getRow"></zhibiaoTable>
      <span slot="footer" class="dialog-footer">
        <el-button plain type="primary" @click="addZhibiao">添 加</el-button>
        <el-button plain @click="dialogVisible = false">取 消</el-button>
      </span>
    </el-dialog>
  </el-dialog>
</template>

<script>
import zhibiaoTable from "@/views/dailyExamine/components/targetIndexTable"; //指标表格

import {
  targetDetail,
  targetNeedFill,
  saveFillTarget,
  zltest
} from "@/api/dailyExamine/targetExamine/indicatorFormulation";
import { getObj } from "@/api/admin/user.js";
import { validatenull } from "@/util/validate"; //判断空

export default {
  data() {
    return {
      fatherData: {},
      chooseTarget: [], //指标数组
      isDelete: true, //是否能删除
      dialogVisible: false, //指标库显隐
      multipleSelection: [], //选择数组
      dataList: [], //表格数据
      visible: false, //最外层弹窗
      dataForm: {}, //表单对象
      userData: {}, //登录人信息对象
    };
  },
  watch: {
    // 监听选中
    multipleSelection: {
      handler(val) {
        if (val.length > 0) {
          this.isDelete = false;
        } else {
          this.isDelete = true;
        }
      }
    }
  },
  components: {
    zhibiaoTable //指标组件
  },
  created() {
    this.getUserData();
  },
  methods: {
    // 获取登录人信息
    getUserData() {
      let id = JSON.parse(sessionStorage.getItem("bfcloud-userInfo")).content
        .userId;
      getObj(id).then(r => {
        this.userData = r.data.data;
      });
    },
    //添加分数
    getScore(row, index){
        if(row.finishValue !=null && row.finishValue !="") {
            zltest(row.id,row.finishValue)
                .then(r => {
                    console.log(r.data.data);
                    row.score = this.numFilter(r.data.data);
                })
                .catch(err => {

                });
        }else{
            row.score = '';
        }
        if(row.finishValue == null || row.finishValue ==""){
            row.score = '';
        }


    },
    // 删除指标
    deleteIndexRow() {
      this.$confirm("是否确认删除", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          let temp = [];
          this.multipleSelection.map(it => {
            this.dataList.map(itt => {
              if (it.id !== itt.id) {
                temp.push(itt);
              }
            });
          });
          this.dataList = [...temp];
        })
        .catch(() => {});
    },
    // 查询数据详情
    getDataDetail(id) {
      targetDetail(id)
        .then(r => {
          if (r.data.code == 0) {
            this.dataForm = r.data.data;
            this.dataForm.assessTarget = r.data.data.participantList.map(it => {
              return it.assessRealName;
            });
            this.dataForm.assessTarget1 = r.data.data.participantList.map(
              it => {
                return it.assessDeptName;
              }
            );
          } else {
            this.$message.error(r.data.msg);
          }
        })
        .catch(err => {});
    },
    // 查询需要自己填写的指标
    getNeedFillTarget(id) {
      targetNeedFill(id)
        .then(r => {
          if (r.data.code == 0) {
            this.dataList = r.data.data;
          } else {
            this.$message.error(r.data.msg);
          }
        })
        .catch(err => {});
    },
    // 增加指标
    addZhibiao() {
      let tempList = this.chooseTarget.map(it => {
        it.type = it.normLx;
        it.name = it.normName;
        it.formula = it.normGsname;
        it.formulaId = it.normGs;
        it.completeValue = it.normGetDate;
        it.itemIndex = it.normPx;
        it.keiExplain = it.normSm;
        it.unit = it.normDw;
        it.normId = it.normId ;
        it.provideDeptId = this.userData.deptId;
        it.provideDeptName = this.userData.deptName;
        it.provideRealName = this.userData.ryName;
        it.provideUserId = this.userData.userId;
        it.provideUserName = this.userData.username;
        return it;
      });
      this.dataList = [...this.dataList, ...Object.assign(tempList)];
      this.dialogVisible = false;
    },
    // 指标组件传过来的数据
    getRow(rows) {
      this.chooseTarget = rows;
    },
    // 显示指标库
    showTarLibrary() {
      this.dialogVisible = true;
      this.$nextTick(() => {
        this.$refs.zhibiaoRef.init(1, 1);
      });
    },
    // 指标选中
    handleSelectionChange(val) {
      this.multipleSelection = val;
    },
    // 确定
    handleConfirm() {
      this.$refs.dataForm.validate(valid => {
        if (valid) {

            //验证是否超200字
            let flagTargetValue = this.dataList.every( it=> {
                return !validatenull(it.finishValue) && it.finishValue.length<=200 ;
            }) ;
            if (!flagTargetValue){
                this.$message.error('完成值不可为空且不可超过200字');
                return ;
            }
          saveFillTarget(this.dataList, this.fatherData.id, 0)
            .then(r => {
              if (r.data.code == 0) {
                this.$message.success("填报成功");
                this.closeDialog();
                this.$emit("closeDialog");
              }
            })
            .catch(err => {});
        } else {
          console.log("error submit!!");
          return false;
        }
      });
    },

    // 初始化
    init(data) {

      this.visible = true;
      this.fatherData = data;
      this.getDataDetail(data.id);
      this.getNeedFillTarget(data.id);
    },
    numFilter(value) {
        const realVal = parseFloat(value).toFixed(2);
        return realVal;
    },
    // 关闭
    closeDialog() {
      this.visible = false;
      this.$emit("closeDialog");
    }
  }
};
</script>

<style lang="scss">
.tabBox {
  width: 100%;
  .btnBox {
    display: flex;
    justify-content: space-between;
  }
}
</style>
